new Vue({
    el: '#app',
    data: function() {
        return {
            visible: false,
            formLabelWidth: '90px',
            searchName: '',//菜单栏搜索数据
            yydm:'', //点击应用代码
            yyzcList: [],//应用列表
            tableData: [], //菜单列表
            menuList:[], //菜单列表List
            pIdList:[]
        }
    },
    //变量监听，当模板值发生变换时触发
    watch: {

    },
    //页面加载成功后执行
    mounted:function(){
        //获取应用列表
        this.getYyzc();
        //this.getTableData();
        //this.expandedTree();

    },
    // 周期定义
    updated: function (){
        this.$nextTick(function(){
            //在下次 DOM 更新循环结束之后执行这个回调。在修改数据之后立即使用这个方法，获取更新后的DOM.
            //this.openCdList(this.tableData[0]);
        })
    },
    // 方法定义
    methods: {
        /**
         * 获取应用列表
         * @param type
         */
        getYyzc:function(){
            var me = this;
            $.ajax({
                type: "GET",
                contentType: "application/json",
                dataType: "json",
                url: "commonapi/queryApplication",
                success: function (jsonData) {
                    me.yyzcList = jsonData.list;
                    me.yydm=jsonData.list[0].yydm;
                    me.getTableData();
                }
            });
        },
        /**
         * 获取菜单列表
         * @param type
         */
        getTableData:function(){
            var me = this;
            var queryParams = {yydm:me.yydm,parmers:$.trim(me.searchName)};
            queryParams=JSON.stringify(queryParams);
            $.ajax({
                type: "POST",
                contentType: "application/json",
                dataType: "json",
                url: "menu/queryGncd",
                data:queryParams,
                dataType: "json",
                success: function (jsonData) {
                    me.tableData = jsonData.menuTreeList;
                    me.menuList = jsonData.menuList;

                }
            });
        },

        /**
         * 左侧应用单击事件
         */
        treeClick:function(row){
            if(row.yydm != this.yydm){
                this.searchName = '';
            }
            this.yydm= row.yydm;
            this.getTableData();
        },

        /**
         * 上移菜单
         */
        moveUp:function(row) {
            var data=this.tableData;
            this.pIdList=[];//清空
            //找出菜单所有父节点
            this.queryPIdList(row);
            //寻找点击树的同级菜单,需要带children（从树顶级下钻到次跟节点）
            var child=this.queryPId(data);
            //调换顺序
            for(var j=0;j<child.length;j++){
                //当是操作行且不是第一个行时进行上移操作
                if(row.id== child[j].id&&j>0){
                    //修改页面的排列顺序并重新渲染
                    var temp = child[j];
                    child[j]=child[j-1];
                    child[j-1]=temp;
                    break;
                }
            }
            //重新给排序字段赋值
            for(var k=0;k<child.length; k++){
                child[k].mgorder=k+1;
            }
            /*//更新页面显示
            this.updateTableData(child);*/
            //更新数据库
            this.updateGncdList(child);
        },
        /**
         * 下移菜单
         */
        moveDown:function(row) {
            var data=this.tableData;

            this.pIdList=[];//清空
            //找出菜单所有父节点
            this.queryPIdList(row);
            //寻找点击树的同级菜单,需要带children（从树顶级下钻到次跟节点）
            var child=this.queryPId(data);

            //调换顺序
            for(var j=0;j<child.length;j++){
                //当是操作行且不是第一个行时进行上移操作
                if(row.id== child[j].id&&j<child.length-1){
                    //修改页面的排列顺序并重新渲染
                    var temp = child[j];
                    child[j]=child[j+1];
                    child[j+1]=temp;
                    break;
                }
            }
            //重新给排序字段赋值
            for(var k=0;k<child.length; k++){
                child[k].mgorder=k+1;
            }
           /* //更新页面显示
            this.updateTableData(child);*/
            //更新数据库
            this.updateGncdList(child);

        },
        /**
         * 保存菜单顺序
         */
        updateGncdList:function(child) {
            var queryParams = JSON.stringify(child);
            var me=this;
            $.ajax({
                type: "POST",
                contentType: "application/json",
                dataType: "json",
                url: "menu/updateGncdList",
                data:queryParams,
                dataType: "json",
                success: function (jsonData) {
                    //重新加载数据
                    me.getTableData();
                }
            });
        },

        /**
         * 找出菜单所有父节点
         */
        queryPIdList:function(row) {
            var data=this.menuList;
            var pId=row.pId;
            if(pId!=null && pId!=''){
                for(var i=0;i<data.length; i++) {
                    if (data[i].id == pId ) {
                        var length=this.pIdList.length;
                        //往父级菜单列表中添加id
                        this.pIdList[length]=data[i];
                        this.queryPIdList(data[i]);
                    }
                }
            }
        },

        /**
         * 寻找点击树的次跟节点（从树顶级下钻到次跟节点）
         */
        queryPId:function(data) {
            var list=this.pIdList;//父级list
            var  child=this.tableData;  //当是顶级菜单时返回

            for(var j=0;j<data.length; j++){
                for(var i=list.length-1;i>=0; i--){
                    if(list[i].id==data[j].id){
                        if(i>0){
                            data= data[j].children;
                            return this.queryPId(data);
                        }else{
                            child= data[j].children
                            return child;
                        }
                    }
                }
            }
            return child;
        },

        /**
         * 更新页面显示
         */
        updateTableData:function(child) {
            var list=this.pIdList;
            //从点击层将菜单循环放入自己的父类列表中
            for(var i=0;i<list.length; i++) {
                if(i==0){
                    //移动菜单及同级放入
                    list[i].children=child;
                }else{
                    for(var j=0;j<list[i].children.length;j++){
                        if(list[i].children[j].id==list[i-1].id){
                            list[i].children[j] = list[i-1];
                        }
                    }
                }
            }
            //给tableData赋值
            var length=list.length;
            if(length>0){  //说明是非顶级菜单
                var table=this.tableData;
                this.tableData=[];
                //this.tableData[0]=list[length-1];
                for(var i=0;i<table.length;i++){
                    if(table[i].id==list[length-1].id){
                        this.tableData[i]=list[length-1];
                    }else{
                        this.tableData[i]=table[i];
                    }
                }
            }else{
                //说明是顶级菜单
                this.tableData=[];
                for(var i=0;i<child.length; i++) {
                    this.tableData[i]=child[i];
                }
            }
            //恢复为空
            this.pIdList=[];
        },
        /**
         * 打开服务新增窗口
         */
        openCd: function(type,row){
            if (type=='add'){
                LayerWn.openDialog('新增菜单', 'plat-menu-add.html?yydm=' + this.yydm, 910, 537);
            } else if(type=='edit'){
                LayerWn.openDialog('编辑菜单', 'plat-menu-add.html?yydm=' + this.yydm + '&mcode=' + row.id, 910, 537);
            }
        },

        /**
         * 格式化
         */
        formatJlzt:function(row) {
            return row.active == 'Y' ? '<font color="#07BFA7">正常</font>' : '<font color="#ff6666">停用</font>';
        },

        /**
         * 默认展开一级菜单
         */
        openCdList:function(row) {
            this.$refs.gncdTree.toggleRowExpansion(row , true);
        },
        
    }
});
